Skip to main content

Intro

The Kyber 13 Design System extends Bootstrap 5.3 with additional components, styles, and utility classes. There are notable changes to colors, spacing, and typography. It also exposes all of the Bootstrap utility classes and CSS custom properties (CSS variables) for use in your application.

CSS Custom properties

Kyber uses CSS custom properties to allow for easy theming globally or at the component level. When extending styles of individual components it is necessary to provide the CSS property value at the component class. For example, to change the background color of a button to red, you would add the following CSS:

Current :root CSS custom properties
--bs-btn-close-filter: ;